<template>
  <PageContainer :transparent="true">
    <Header title="邀请好友" :is-box-shadow="false" />
    <template>
      <!-- 未操作 -->
      <view
        v-if="pageType === 'normal'"
        class="hb-flex hb-flex-col hb-items-center hb-py-10 hb-px-4"
      >
        <TmImage
          class="hb-mb-4"
          :src="botInfo?.iconFileUrl"
          error-img-type="person"
          :width="128"
          :height="128"
        />
        <TmText :label="botInfo?.name" :font-size="48" />
        <TmText label="邀请您成为好友" :font-size="48" />
        <BottomSubmit
          :show-bg-color="false"
          :hide-cancel-btn="false"
          :is-station="false"
          :bottom="30"
          cancel-btn-label="拒绝邀请"
          submit-btn-label="同意邀请"
          @submit="handleConfirm"
          @cancel="handleCancel"
        />
      </view>
      <!-- 同意 -->
      <view
        v-else-if="pageType === 'agree'"
        class="hb-flex hb-flex-col hb-items-center hb-py-10 hb-px-16"
      >
        <TmIcon
          _class="hb-mb-4"
          name="ali-icon icon-danxuan_xuanzhong"
          :font-size="128"
          color="primary"
        />
        <TmText _class="hb-mb-4 hb-font-bold" label="已成为好友" :font-size="48" />
        <TmText
          _class="hb-text-center"
          :label="`您已成功添加[${botInfo?.name}]的小助手为好友`"
          :font-size="32"
        />
        <BottomSubmit
          :show-bg-color="false"
          :is-station="false"
          :bottom="30"
          submit-btn-label="回到首页"
          @submit="handleBackHome"
        />
      </view>
      <!-- 拒绝 -->
      <view
        v-else-if="pageType === 'reject'"
        class="hb-flex hb-flex-col hb-items-center hb-py-10 hb-px-16"
      >
        <TmIcon
          _class="hb-mb-4"
          name="ali-icon icon-close_circle_fill"
          :font-size="128"
          color="#EA5E0E"
        />
        <TmText _class="hb-mb-4 hb-font-bold" label="已拒绝添加好友" :font-size="48" />
        <TmText
          _class="hb-text-center"
          :label="`您已拒绝添加[${botInfo?.name}]的小助手为好友`"
          :font-size="32"
        />
        <BottomSubmit
          :show-bg-color="false"
          :is-station="false"
          :bottom="30"
          submit-btn-label="回到首页"
          @submit="handleBackHome"
        />
      </view>

      <SelectAI
        v-if="botInfo"
        v-model="showSelectAI"
        modal-title="确定要用以下智能助手添加好友？"
        modal-ok-text="添加好友"
        @ok="handleAgree"
      />
    </template>
  </PageContainer>
</template>

<script lang="ts" setup>
  /* inviteFriends 邀请好友 */
  import { useUserStore } from '@/store/modules/user';
  import { TabbarPageEnum } from '@/enums/PageEnum';
  import { agreeInvite, queryBecomeFriends } from '@/api/contact';
  import { getBotById } from '@/api/aiChatPage';
  import { BotInfo } from '@/api/aiChatPage/types';
  import { AiAccountBotListResult } from '@/api/aiSettings/types';

  const pageType = ref<'normal' | 'agree' | 'reject'>('normal');

  const useUser = useUserStore();
  const { userInfo } = storeToRefs(useUser);
  const botInfo = ref<BotInfo>();

  const activeId = ref<number>();

  const showSelectAI = ref(false);

  const userUUID = ref<string>();

  customOnload<'inviteFriends'>(async (op) => {
    activeId.value = userInfo.value?.aiUserAccountBotVo?.id;
    userUUID.value = op.uuid;
    botInfo.value = await getBotById(op.uuid);
    // const bol = await queryBecomeFriends(op.uuid);
    // if (bol) {
    //   pageType.value = 'agree';
    //   return;
    // }
  });

  const handleConfirm = () => {
    if (!userInfo.value?.aiUserAccountBotVo) {
      uni.showModal({
        title: '成为好友提醒',
        content: '申请成为好友需要您先创建智能助手',
        cancelColor: '#969799',
        cancelText: '取消',
        confirmColor: '#2878FF',
        confirmText: '一键创建',
        success: (res) => {
          if (res.confirm) reLaunch({ name: 'createAi' });
        },
      });
      return;
    }

    showSelectAI.value = true;
  };

  const handleAgree = (data: AiAccountBotListResult) => {
    agreeInvite({ uuid: userUUID.value!, currentBotId: data.id }).then(() => {
      pageType.value = 'agree';
      showSelectAI.value = false;
    });
  };

  const handleCancel = () => {
    uni.showModal({
      title: '拒绝添加好友',
      content: '确认要拒绝添加好友吗？',
      cancelColor: '#969799',
      cancelText: '取消',
      confirmColor: '#2878FF',
      confirmText: '拒绝添加',
      success: (res) => {
        /** 拒绝添加 */
        res.confirm && (pageType.value = 'reject');
      },
    });
  };

  const handleBackHome = () => switchTab(TabbarPageEnum.BASE_HOME);
</script>

<style lang="scss" scoped></style>
